import 'package:flutter/material.dart';
import 'package:lx_widgets_library/lx_widgets_library.dart';

// 滑动条
class LxSlider extends StatefulWidget {
  final double min;
  final double max;
  final double value;
  final ValueChanged<double>? onChanged;
  final ValueChanged<double>? onChangeEnd;

  const LxSlider({
    Key? key,
    required this.min,
    required this.max,
    required this.value,
    this.onChanged,
    this.onChangeEnd,
  }) : super(key: key);

  @override
  LxSliderState createState() => LxSliderState();
}

class LxSliderState extends State<LxSlider> {
  late double _currentValue;

  @override
  void initState() {
    super.initState();
    _currentValue = widget.value;
  }

  @override
  void didUpdateWidget(LxSlider oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (widget.value != oldWidget.value) {
      setState(() {
        _currentValue = widget.value;
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    double sliderLineHeight = 8.0;
    double backgroundLineHeight = sliderLineHeight + 4.0;
    return Stack(
      alignment: Alignment.center,
      children: [
        Container(
          height: backgroundLineHeight,
          decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.circular(backgroundLineHeight / 2),
          ),
        ),
        Padding(
          padding: EdgeInsets.only(
              left: (backgroundLineHeight - sliderLineHeight) / 2,
              right: (backgroundLineHeight - sliderLineHeight) / 2),
          child: SliderTheme(
            data: SliderThemeData(
              trackHeight: sliderLineHeight,
              activeTrackColor: Colors.transparent,
              inactiveTrackColor: Colors.white,
              thumbColor: LxCol.theme,
              overlayColor: Colors.white.withOpacity(0.2),
              thumbShape: const RoundSliderThumbShape(enabledThumbRadius: 10.0),
              trackShape: GradientRectSliderTrackShape(
                gradient: const LinearGradient(
                  colors: [
                    Color(0xFFE26200),
                    Color(0xFFFFA400),
                  ],
                  begin: Alignment.centerLeft,
                  end: Alignment.centerRight,
                ),
                radius: Radius.circular(
                  sliderLineHeight / 2,
                ), // Added radius for rounded corners
              ),
              // Add rounded shapes for the slider components
              rangeTrackShape: const RoundedRectRangeSliderTrackShape(),
              overlayShape: const RoundSliderOverlayShape(overlayRadius: 20.0),
            ),
            child: SizedBox(
              height: 30.0,
              child: Slider(
                value: _currentValue,
                min: widget.min,
                max: widget.max,
                onChanged: (value) {
                  setState(() {
                    _currentValue = value;
                  });
                  if (widget.onChanged != null) {
                    widget.onChanged!(value);
                  }
                },
                onChangeEnd: (value) {
                  if (widget.onChangeEnd != null) {
                    widget.onChangeEnd!(value);
                  }
                },
              ),
            ),
          ),
        ),
      ],
    );
  }
}

// Custom track shape that paints a gradient
class GradientRectSliderTrackShape extends SliderTrackShape {
  final LinearGradient gradient;
  final Radius radius;

  const GradientRectSliderTrackShape({
    required this.gradient,
    this.radius = const Radius.circular(2.0),
  });

  @override
  Rect getPreferredRect({
    required RenderBox parentBox,
    Offset offset = Offset.zero,
    required SliderThemeData sliderTheme,
    bool isEnabled = false,
    bool isDiscrete = false,
  }) {
    final double trackHeight = sliderTheme.trackHeight ?? 4.0;
    final double trackLeft = offset.dx;
    final double trackTop =
        offset.dy + (parentBox.size.height - trackHeight) / 2;
    final double trackWidth = parentBox.size.width;
    return Rect.fromLTWH(trackLeft, trackTop, trackWidth, trackHeight);
  }

  @override
  void paint(PaintingContext context, Offset offset,
      {required RenderBox parentBox,
      required SliderThemeData sliderTheme,
      required Animation<double> enableAnimation,
      required Offset thumbCenter,
      Offset? secondaryOffset,
      bool isEnabled = true,
      bool isDiscrete = false,
      required TextDirection textDirection}) {
    final Rect trackRect = getPreferredRect(
      parentBox: parentBox,
      offset: offset,
      sliderTheme: sliderTheme,
      isEnabled: isEnabled,
      isDiscrete: isDiscrete,
    );

    // Draw inactive track
    final Paint inactivePaint = Paint()
      ..color = sliderTheme.inactiveTrackColor ?? Colors.grey.shade400
      ..style = PaintingStyle.fill;

    final RRect inactiveTrackRRect = RRect.fromRectAndRadius(
      trackRect,
      radius,
    );
    context.canvas.drawRRect(inactiveTrackRRect, inactivePaint);

    // Draw active track with gradient
    final double valuePosition = thumbCenter.dx;
    final Paint activePaint = Paint()
      ..shader = gradient.createShader(trackRect);

    final RRect activeTrackRRect = RRect.fromRectAndRadius(
      Rect.fromLTRB(
          trackRect.left, trackRect.top, valuePosition, trackRect.bottom),
      radius,
    );
    context.canvas.drawRRect(activeTrackRRect, activePaint);
  }
}
